<script src="app/controllers/blogs/AddNewWordpressController.js"></script>

<div class="hfr-loading" ng-class="{true:'hfr-showContent', false:''}[showViewContent]" ng-controller="AddNewWordpressController">
	<div class="hfr-contentLoadingBar">
		<div id="dot1" class="loader-dot"></div>
		<div id="dot2" class="loader-dot"></div>
		<div id="dot3" class="loader-dot"></div>
	</div>
	<div class="hfr-loadingStatus">
		<!-- VIEW Create new site wordpress
    	================================================== -->
    	<div id="hfr-addNewSite" class="hfr-mw450 hfr-margin-auto">
			<form class="hfr-formAddNewSite" name="wpForm">
				<h2 class="hfr-heading">{{pageTitle}}</h2>
				<p>Works with both wordpress.com and custom deploy</p>
				<div class="form-group">
					<span class="label label-danger hfr-preShow" ng-class="{'hfr-show': submitted && wpForm.siteurl.$error.required}">{{'message.error.required' | translate}}</span>
					<span class="label label-danger hfr-preShow" ng-class="{'hfr-show': submitted && wpForm.$error.url}">{{'message.error.url' | translate}}</span>
					<div class="input-group">
						<input type="url" placeholder="{{'static.addWordpress.websiteUrl' | translate}}" name="siteurl" class="form-control" ng-model="siteurl" 
							ng-readonly="editForm" required />
						<span class="input-group-addon ti-world"></span>
					</div>
				</div>
				<div class="form-group">
					<span class="label label-danger hfr-preShow" ng-class="{'hfr-show': submitted && wpForm.username.$error.required}">{{'message.error.required' | translate}}</span>
					<div class="input-group">
						<input type="text" placeholder="{{'static.addWordpress.username' | translate}}" name="username" class="form-control"  ng-model="username" required />
						<span class="input-group-addon ti-user"></span>
					</div>
				</div>
				<div class="form-group">
					<span class="label label-danger hfr-preShow" ng-class="{'hfr-show': submitted && wpForm.psswd.$error.required}">{{'message.error.required' | translate}}</span>
					<div class="input-group">
						<input type="password" placeholder="{{'static.addWordpress.password' | translate}}" name="psswd" class="form-control" ng-model="password" ng-enter="check_info(wpForm)" required />
						<span class="input-group-addon ti-lock"></span>
					</div>
				</div>
				<div class="form-group">
					<a href="#"><small><ins>{{ 'blog.link.figure_out' | translate }}</ins></small></a>
				</div>
				<hr>
				<div class="row">
					<div class="col-md-4">
						<a href class="hfr-button-link" back-button>
							<span class="ti-angle-left"></span> {{'static.addWordpress.back' | translate}}
						</a>
					</div>
					<div class="col-md-8 content-right">
						<button type="button" id="loading-btn" ng-click="check_info(wpForm)" class="hfr-button-blue hfr-solid" 
							ng-class="{'hfr-loading': processing == true}" ng-disabled="processing" ng-hide="success">
							<span class="hfr-spin ti-reload"></span>{{'static.addWordpress.checkInfomation' | translate}}
						</button>
						<button type="button" ng-click="create_site(wpForm)" class="hfr-button-blue hfr-solid" 
							ng-class="{'hfr-loading': processing == true}" ng-disabled="processing" ng-show="next-step">
							<span class="hfr-spin ti-reload"></span>
							<any ng-if="editForm === false">{{'static.addWordpress.saveAndNext' | translate}}</any>
							<any ng-if="editForm">{{'static.addWordpress.update' | translate}}</any>
						</button>
					</div>
				</div>		
			</form>
			
		</div>
    	<!-- =============== End view =============== -->
	</div>
</div>